import React /*, {
	PureComponent
}*/ from 'react';
import pathToRegexp from 'path-to-regexp';
// import classNames from 'classnames'
// import { Layout } from 'antd'
// import { connect } from 'dva'
import NProgress from 'nprogress';
import 'nprogress/nprogress.css';
import Authorized from '@/components/Authorized';
import Exception from '@/pages/exception/403';

// import SiderMenu from '@/components/SiderMenu'

// const { Content } = Layout

// const BasicLayout = ({ menu, children }) => {
// 	return (
// 		<Layout>
// 			<SiderMenu menu={menu}></SiderMenu>
// 			<Layout style={{minHeight: '100vh'}}>
// 				<Content>{children}</Content>
// 			</Layout>
// 		</Layout>
// 	)
// }

import SiderMenu from '@/components/SiderMenu';
import Header from './Header';

let lastPath = '';

const getRouterAuthority = (pathname, routeData) => {
  let routeAuthority = [];
  const getAuthority = (key, routes) => {
    routes.forEach(route => {
      if (route.path && pathToRegexp(route.path).test(key)) {
        routeAuthority = route.authority;
      } else if (route.routes) {
        routeAuthority = getAuthority(key, route.routes);
      }
      return route;
    });
    return routeAuthority;
  };
  return getAuthority(pathname, routeData);
};

const BasicLayout = ({ children, loading, ...props }) => {
  const {
    user: { authorities = [] },
    location,
    route: { routes },
  } = props;

  const path = location.pathname + location.search;
  if (path !== lastPath) {
    NProgress.start();
  }

  if (!loading.global) {
    NProgress.done();
    lastPath = path;
  }
  const authority = getRouterAuthority(location.pathname, routes);
  return (
    <div className="section">
      <div className="aside">
        <div className="aside-body">
          <div className="aside-tab">
            <div className="aside-panel">
              {/*<div className="aside-logo"></div>*/}
              <div className="aside-nav">
                <SiderMenu {...props} tooltip></SiderMenu>
              </div>
            </div>
            <div className="aside-nav aside-footer">
              <SiderMenu {...props} system={true}></SiderMenu>
            </div>
          </div>
        </div>
      </div>
      <Header />
      <div className="primary">
        <Authorized authorities={authorities} authority={authority} noMatch={<Exception />}>
          {children}
        </Authorized>
      </div>
    </div>
  );
};

// class BasicLayout extends PureComponent {
// 	componentDidMount() {
// 		const {
// 			dispatch
// 		} = this.props
// 		dispatch({
// 			type: 'user/fetchCurrent'
// 		})
// 	}
// 	render() {
// 		const {
// 			children
// 		} = this.props
// 		return (
// 			<Layout>
//  				{children}
//  			</Layout>
// 		)
// 	}
// }

// export default connect(({ app: { menu=[], user={}, }, loading }) => ({
// 	menu,
// 	user,
// 	loading
// }))(BasicLayout)
export default BasicLayout;
